import React, { useState } from 'react';
import { Button, Text, View } from 'react-native';
import DocumentPicker from 'react-native-document-picker';
import * as FileSystem from 'expo-file-system';
import RNFS from 'react-native-fs';

/*
    npx create-expo-app doc-picker-bug
    cd doc-picker-bug/
    npm i react-native-document-picker
    npx expo prebuild
    npx expo run:ios
*/
export default function PickFile() {
    const [result, setResult] = useState('');
    const [uri, setUri] = useState('');

    const pick = async () => {
        try {
            // 选择本地文件
            const res = await DocumentPicker.pickSingle({
                type: [DocumentPicker.types.allFiles],
            });

            if (res) {
                setResult(`选择的文件：${res.uri}，type：${res.type}，name：${res.name}，size：${res.size}，fileCopyUri：${res.fileCopyUri}，copyError：${res.copyError}`);
                setUri(res.uri)

                // 在 Android 4.4 及以上的机型，使用了 DocumentUri 来代表获取到文件的 URI 。要对 DocumentUri 进行适配。
                const u = res.uri;
                console.log('u: ' + u)
                readFileContent(u);

            } else {
                setResult('未选择文件');
            }

        } catch (err) {
            setResult('发生错误：' + err);
            console.log('发生错误：' + err)
        }
    };
    return (
        <View>
            <Button title="选择文件" onPress={pick} />
            <Text style={{ marginTop: 10 }}>{result}</Text>
        </View>
    );
}

const readFileContent = async (fileUri:any) => {
    try {
        // readAsStringAsync 方法接受文件的 URI 和读取模式（默认是 UTF-8 编码）作为参数，并返回一个 Promise，该 Promise 解析为文件的内容字符串。
        // const content = await FileSystem.readAsStringAsync(fileUri);
        console.log("读取文件")
        const content = await RNFS.readFile(fileUri)

        console.log('File content:', content);
    } catch (error) {
        console.error('Failed to read the file:', error);
    }
};